$(function () {
    getProductTypeOption();
    getUserTypeOption();
    introEditor();
    $("#name").change(function () {
        if ($("#name").val() != "")
            $("#name_tips").html("");
    });
    $("#name").blur(function () {
        if ($("#name").val() == "")
            $("#name_tips").html("请输入产品名称");
    });
    $("#product_intro").change(function () {
        if ($("#product_intro").val() != "")
            $("#intro_tips").html("");
    });
    $("#product_intro").blur(function () {
        if ($("#product_intro").val() == "")
            $("#intro_tips").html("请输入产品简介");
    });
});

var intro_editor;

function introEditor() {
    let E = window.wangEditor;
    intro_editor = new E('#intro_editor');
    let intro = $('#product_intro');
    intro_editor.config.onchange = function (html) {
        // 第二步，监控变化，同步更新到 textarea
        intro.val(html);
    };
    // 配置 server 接口地址
    intro_editor.config.uploadImgServer = '/editor/upload';
    intro_editor.config.showLinkImg = false;//隐藏网络图片按钮
    intro_editor.config.uploadFileName = "img";//向后端传递参数接收的字段名

    intro_editor.config.withCredentials = true;
    // 将图片大小限制为 5M
    intro_editor.config.uploadImgMaxSize = 5 * 1024 * 1024;
    // 限制一次最多上传 5 张图片
    intro_editor.config.uploadImgMaxLength = 5;

    intro_editor.config.uploadImgHooks = {

        // 图片上传并返回了结果，图片插入已成功之后触发
        success: function (xhr) {
            console.log('success', xhr)
        },
        // 图片上传并返回了结果，但图片插入时出错了
        fail: function (xhr, editor, resData) {
            console.log('fail', resData)
        },
        // 上传图片出错，一般为 http 请求的错误
        error: function (xhr, editor, resData) {
            console.log('error', xhr, resData)
        },
        // 上传图片超时
        timeout: function (xhr) {
            console.log('timeout');
        },
        // 图片上传并返回了结果，想要自己把图片插入到编辑器中
        // 例如服务器端返回的不是 { errno: 0, data: [...] } 这种格式，可使用 customInsert
        customInsert: function (insertImgFn, result) {
            // 图片上传并返回结果，自定义插入图片的事件（而不是编辑器自动插入图片！！！）
            // result 即服务端返回的接口
            console.log('customInsert', result.url);

            // insertImgFn 可把图片插入到编辑器，传入图片 src ，执行函数即可
            insertImgFn(result.url);
            // result 必须是一个 JSON 格式字符串！！！否则报错
        }
    };
    intro_editor.create();

    // 第一步，初始化 textarea 的值
    intro.val(intro_editor.txt.html());
}

function productadd() {
    let photo = sessionStorage.getItem("productphoto");
    console.log(photo);
    let data = {
        'name': $("#name").val(),
        'user_type': $("#user_type").find("option:selected").val(),
        'product_type': $("#product_type").find("option:selected").val(),
        'price': $("#price").val(),
        'photo': photo,
        'intro':$("#product_intro").val()
    };
    if (photo != "" && photo != null && $("#name").val() != null && $("#name").val() != "") {
        let result = myAjax('/back/product/add', 'post', data, 'text');
        console.log(result);
        if (result == 1) {
            alert("添加成功！");
            $(".right").load("../html/back/product/product.html");
        } else if (result == 0) {
            alert("添加失败！");
        } else
            alert(result);
    } else if (photo == "" || photo == null)
        alert("请选择产品图片！");
    else
        alert("请完善产品添加信息！");
}

function add() {
    let formData = new FormData();
    formData.append('name', $("#name").val());
    formData.append('user_type', $("#user_type").find("option:selected").val());
    formData.append('product_type', $("#product_type").find("option:selected").val());
    formData.append('price', $("#price").val());
    formData.append('photo', $("#productphoto")[0].files[0]);
    let data = uploadAjax('/back/product/add', 'post', formData, 'text');
    console.log(data);
    if (data == 1) {
        alert("添加成功！");
        $(".right").load("../html/back/product/product.html");
    } else if (data == 0) {
        alert("添加失败！");
    } else {
        alert(data);
    }
}

function pictureChange() {
    let formData = new FormData();//获取表单中的文件
    let productphoto = $('#productphoto')[0].files[0];
    if (productphoto != null && productphoto != undefined) {
        formData.append("photo", productphoto);
        let data = uploadAjax("/upload", 'post', formData, 'text');
        console.log(data);
        if (data != "") {
            $("#productimg").attr("src", data);
            sessionStorage.setItem("productphoto", data);
        } else if (data == 0) {
            console.log("图片上传失败！");
        } else {
            alert("图片上传异常");
        }
    }
}

function getUserTypeOption() {
    let data = myAjax('/back/product/usertype', 'get', '', 'json');
    console.log(data);
    $("#user_type").html("");
    $.each(data.userType, function (i, usertype) {
        $("#user_type").append("<option value='" + usertype.id + "'>" + usertype.name + "</option>");
    });
}

function getProductTypeOption() {
    let data = myAjax('/back/product/type', 'get', '', 'json');
    console.log(data);
    $("#product_type").html("");
    $.each(data.productType, function (i, producttype) {
        $("#product_type").append("<option value='" + producttype.id + "'>" + producttype.name + "</option>");
    });
}